<script lang="ts" setup>
import GA1400DataView from './components/GA1400Data.vue';
import GA1400ConnectView from './components/GA1400Connect.vue';
</script>

<template>
  <div class="GA1400-wrap">
    <div class="left">
      <div class="left-top">
        <title-view title="参数配置" icon="item-register"></title-view>
        <div class="left-top-right">
          <svg-icon class="item-icon" name="item-dataInfo02"></svg-icon>
          <t-link theme="primary" style="margin-left: 8px; font-size: 12px; line-height: 16px" underline>保存</t-link>
        </div>
      </div>
      <div class="content">
        <GA1400DataView></GA1400DataView>
      </div>
    </div>
    <div class="right">
      <title-view title="设备连接情况" icon="item-info"></title-view>
      <div class="content">
        <GA1400ConnectView></GA1400ConnectView>
      </div>
    </div>
  </div>
</template>

<style lang="less" scoped>
.GA1400-wrap {
  width: 100%;
  height: calc(100vh - @headerHeight - 42px - 22px - 42px) !important;
  display: flex;
  justify-content: space-between;
  padding-top: 26px;
  .left {
    width: 46%;
    height: calc(100% - 26px);
    .left-top {
      height: 22px;
      margin-bottom: 10px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      .left-top-right {
        height: 22px;
        display: flex;
        align-items: center;
      }
    }
  }
  .right {
    width: 53%;
    height: calc(100% - 26px);
  }
  .content {
    width: 100%;
    height: calc(100% - 12px);
    background-color: #fff;
  }
}
</style>
